<!DOCTYPE html>
<html ng-app="BootApplication">

<head>
	<meta http-equiv="Content-Type" content="Wordpress themetext/html; charset=UTF-8">	
	<title>AcquariumWeb</title>

	<!-- Behavioral Meta Data -->
	<meta name="apple-mobile-web-app-capable" content="yes">
	<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
    <link rel="icon" type="image/png" href="img/small-logo-01.png">
    <link href='http://fonts.googleapis.com/css?family=Roboto:400,900,900italic,700italic,700,500italic,400italic,500,300italic,300' rel='stylesheet' type='text/css'>
	<link href='https://fonts.googleapis.com/css?family=Pacifico' rel='stylesheet' type='text/css'>

	<!-- Import plugin -->
	<jsp:include page="../core/head.jsp"></jsp:include>
</head>

<!-- CONTROLLER -->
<script type="text/javascript" src="<%=request.getContextPath()%>/js/settings/controller/view-profile-ctrl.js"></script>
<!-- SERVICE -->
<script type="text/javascript" src="<%=request.getContextPath()%>/js/settings/service/view-profile-srv.js"></script>

<body ng-controller="ViewProfileController">

	<!-- TOP-BAR -->
	<jsp:include page="../core/top-bar.jsp"></jsp:include>
	
	<!-- HEADER -->
	<div id="wrapper-header">
		<div id="main-header" class="object">
			<div class="logo logoTitle">{{'page.plant.title' | translate}}</div>
	        <div id="main_tip_search"> 
				<form>
					<input type="text" name="search" id="tip_search_input" list="search" autocomplete=off required>
				</form>
			</div>
	        <div id="stripes"></div>
	    </div>
	</div>

	<!-- NAV-BAR -->
	<jsp:include page="../core/nav-bar.jsp"></jsp:include>
	
	<!-- PORTFOLIO -->
	<div id="wrapper-container" class="view-profile">
		<div class="col-md-12 sourceDiv" id="messageBox" ng-show="showSuccessSave" style="text-align: center;background-color: rgba(46, 45, 48, 0.68);height: 40px;padding: 10px 0px;color: white;font-family: fantasy;">Salvataggio effettuato</div>
		<div class="col-md-12 sourceDiv">
			<div class="col-md-3">
				<label class="ng-binding"> Nome </label>
				<input id="user_first_name" size="30" type="text"  ng-model="userModel.firstname">
			</div>

			<div class="col-md-3">
				<label class="ng-binding"> Cognome </label>
				<input id="user_last_name" size="30" type="text" ng-model="userModel.lastname">
				<div class="text-muted space-top-1">Sul tuo profilo pubblico viene visualizzato solo il tuo nome. Quando invii una richiesta di prenotazione, il tuo host potrà vedere il tuo nome e cognome.</div>
			</div>

			<div class="col-md-3">
				<label class="ng-binding"> Data di nascita <i class="icon icon-lock icon-ebisu"data-behavior="tooltip" aria-label="Privato"></i></label>
				<div class="select">
					<select ng-model="userModel.dateBirth.dayOfMonth">
						<option value="{{day.label}}" ng-selected="day.label==userModel.dateBirth.dayOfMonth" ng-repeat="day in days">{{day.label}}</option>
					</select>
				</div>
				<div class="select">
					<select ng-model="userModel.dateBirth.monthValue">
						<option value="{{month.value}}" ng-selected="month.value==userModel.dateBirth.monthValue" ng-repeat="month in months">{{month.label}}</option>
					</select>
				</div>
				<div class="select">
					<select ng-model="userModel.dateBirth.year">
						<option value="{{year.label}}" ng-selected="year.label==userModel.dateBirth.year" ng-repeat="year in years">{{year.label}}</option>
					</select>
				</div>
				<div class="text-muted space-top-1">Il magico giorno in cui sei caduto dal cielo dal becco di una cicogna. Anche questi dati sono utilizzati solo per analisi interne e non verranno condivisi con altri.</div>
			</div>

			<div class="col-md-3">
				<label class="ng-binding">Indirizzo email <i class="icon icon-lock icon-ebisu" data-behavior="tooltip" aria-label="Privato"></i></label>
				<input id="user_email" size="30" type="text"  ng-model="userModel.email">
				<div class="text-muted space-top-1">Non condivideremo il tuo indirizzo privato di posta elettronica con altri utenti.</div>
			</div>
			
			<div class="btn-group noAbs align-btn-center">
				<button type="submit" class="btn btn-primary btn-large" ng-click="saveUser($event)"> Salva</button>
			</div>
		</div>

		<div id="wrapper-thank">
	    	<div class="thank">
	        	<div class="thank-text">Acquarium<span style="letter-spacing:-5px;">-</span>Web</div>
	    	</div>
		</div>

		<!-- MAIN-CONTAINER-FOOTER -->
		<jsp:include page="../core/main-container-footer.jsp"></jsp:include>
		    
	    <!-- WRAPPER-COPYRIGHT -->
	    <jsp:include page="../core/wrapper-copyright.jsp"></jsp:include>
	</div>

	<!-- SCRIPT -->	
	<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
    <script type="text/javascript" src="<%=request.getContextPath()%>/js/jquery.scrollTo.min.js"></script>
    <script type="text/javascript" src="<%=request.getContextPath()%>/js/jquery.localScroll.min.js"></script>
    <script type="text/javascript" src="<%=request.getContextPath()%>/js/jquery-animate-css-rotate-scale.js"></script>
	<script type="text/javascript" src="<%=request.getContextPath()%>/js/fastclick.min.js"></script>
	<script type="text/javascript" src="<%=request.getContextPath()%>/js/jquery.animate-colors-min.js"></script>
	<script type="text/javascript" src="<%=request.getContextPath()%>/js/jquery.animate-shadow-min.js"></script>    
	<script type="text/javascript" src="<%=request.getContextPath()%>/js/main.js"></script>
</body>
</html>